<template>
  <div class="app-container">
    <div class="filter-container">
      <el-date-picker
        v-model="modDateValue"
        class="filter-item"
        :editable="false"
        :clearable="false"
        value-format="timestamp"
        type="datetimerange"
        align="right"
        start-placeholder="开始日期"
        end-placeholder="结束日期"
        :default-time="['00:00:00', '23:59:59']"
        style="width: 380px;">
      </el-date-picker>
      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="getSearch">搜索</el-button>
    </div>

    <el-table
      v-loading="listLoading"
      :data="daylist"
      element-loading-text="Loading"
      border
      fit
      highlight-current-row
    >
      <el-table-column
          type="index"
          label="序号"
          align="center"
          width="50">
      </el-table-column>
      <el-table-column
          label="商户全称"
          align="center">
          <template>
            {{ shopInfo.merhcnatName }}
          </template>
      </el-table-column>
      <el-table-column
          prop="payAmount"
          label="支付金额"
          align="center"
          width="150">
      </el-table-column>
      <el-table-column
          prop="payCount"
          label="支付笔数"
          align="center"
          width="120">
      </el-table-column>
      <el-table-column
          prop="firAgentIncome"
          label="代理商收入"
          align="center"
          width="120">
      </el-table-column>
      <el-table-column
          prop="refundAmount"
          label="退款金额"
          align="center"
          width="120">
      </el-table-column>
      <el-table-column
          prop="refundCount"
          label="退款笔数"
          align="center"
          width="120">
      </el-table-column>
      <el-table-column
          prop="statsTime"
          :formatter="getStatsTime"
          label="统计时间"
          align="center"
          width="120">
      </el-table-column>
    </el-table>
    <pagination v-show="total>0" :total="total" :page.sync="params.current" :limit.sync="params.size" @pagination="getDaylist" />
  </div>
</template>

<script>
import { shopListInfo } from "@/api/api.verify.js"
import Pagination from '@/components/Pagination'

export default {
  components:{Pagination},
  name: 'GatherShopDayInfo',
  data() {
    return {
      btnPower:JSON.parse(localStorage.getItem('btnList')),//按钮权限
      listLoading: true,
      daylist: [],//店铺日汇总列表
      total:0,//总条数
      shopInfo:{merhcnatName:null,merchantNo:null},//店铺信息
      modDateValue: [this.common.getTimeStamp0(-7)*1000,this.common.getTimeStamp24(-1)*1000],//日期
      params:{
        current: 1,
        size: 10,
        merchantNo:null,//店铺编号
        bgnStatTime:this.common.getTimeStamp0(-7),//开始时间
        endStatTime:this.common.getTimeStamp24(-1),//结束时间
      },//查询条件
    }
  },
  created() {
    this.getStart()
  },
  methods: {
    getStart(){//初始化
      this.shopInfo=this.$route.query
      this.params.merchantNo=this.$route.query.merchantNo
      this.getDaylist()
    },
    getDaylist(){//获取日汇总列表
      let _this=this;
      let data=this.params;
      this.listLoading = true
      shopListInfo(data).then(d=>{
        _this.daylist=d.data.records
        _this.total=Number(d.data.total)
      }).finally(d=>{
        _this.listLoading = false
      })
    },
    getSearch(){//查询
      this.params.current=1
      this.getDaylist()
    },

    getStatsTime(row, column, cellValue, index){
      return this.common.getLocalTime(Number(cellValue)*1000,1)
    },
  },
  watch:{
    modDateValue: function () {
        if (this.modDateValue == null) {
            this.params.bgnStatTime = null
            this.params.endStatTime = null
            return
        }
        this.params.bgnStatTime = parseInt(this.modDateValue[0] / 1000)
        this.params.endStatTime = parseInt(this.modDateValue[1] / 1000)
    },
  }
}
</script>
